<template>
    <view class="page">
        <view class="person-title">
            <view class="vertical"></view>
            <view class="title">个人资料</view>
        </view>
        <view class="person-content">
            <view class="person-head">
                <view class="img">
                    <img :src="dataList.photo_url" />
                    <img class="icon" :src="File_Url+'vip-icon.png'" v-if="dataList.is_vip==1" />
                </view>

            </view>
            <view class="person-item">
                <text>真实姓名</text>
                <text class="grey">{{dataList.realname}}</text>
            </view>
            <view class="person-item">
                <text>性别</text>
                <text class="grey">{{dataList.sex}}</text>
            </view>
            <view class="person-item">
                <text>所在企业</text>
                <text class="grey">{{dataList.company_name}}</text>
            </view>
            <view class="person-item">
                <text>岗位信息</text>
                <text class="grey">{{dataList.position}}</text>
            </view>
            <view class="person-item">
                <text>地址</text>
                <text class="grey">{{dataList.province[dataList.unit_province.length-1]=='市'?dataList.province:dataList.province+dataList.city}}{{dataList.area+dataList.address}}</text>
            </view>
            <view class="person-item">
                <text>手机号</text>
                <text class="blue" v-if="dataList.phone!=null" @click="callPhone(dataList.phone)">{{dataList.phone}}</text>
            </view>
        </view>
        <view class="company-title" v-if="is_show_publisher==1||userId==myId">
            <view class="vertical"></view>
            <view class="title">单位资料</view>
        </view>
        <view class="company-content" v-if="dataList.is_unit_auth == 1 && (is_show_publisher==1||userId==myId)">
            <view class="company-head" v-if="dataList.unit_logo.length>0" >
                <view class="img">
                    <img :src="dataList.unit_logo" />
                    <img class="icon" :src="File_Url+'vip-icon.png'" v-if="dataList.is_vip==1" />
                </view>
            </view>
            <view class="company-item">
                <text>单位名称</text>
                <text class="right grey">{{dataList.unit_name}}</text>
            </view>
            <view class="company-item">
                <text>联系方式</text>
                <text class="right blue" v-if="dataList.unit_contact!=null" @click="callPhone(dataList.unit_contact)">{{dataList.unit_contact}}</text>
            </view>
            <view class="company-item">
                <text>统一社会信用代码</text>
                <text class="right grey">{{dataList.unit_credit_code}}</text>
            </view>
            <view class="company-item">
                <text>单位详情地址</text>
                <text class="right grey">{{dataList.unit_province && dataList.unit_province[dataList.unit_province.length-1]=='市'?dataList.unit_province:(dataList.unit_province+dataList.unit_city)}}{{dataList.unit_area+dataList.unit_address}}</text>
            </view>
            <view class="company-range">
                <view class="left">业务范围</view>
                <view class="right">
                    <text v-for="(item,index) in dataList.unit_label" :key="index">{{item}}</text>
                </view>
            </view>
        </view>
        <view class="company-content" style="text-align: center" v-else>
            <view style="width: 100%;height: 100rpx">
                <span style="margin: 40rpx 0 20rpx 0;color:#a7a4a4;font-size: 30rpx">未关联会员单位</span>
            </view>
        </view>
    </view>
</template>

<script>
    export default {
        name: "publisherDetail",
        data(){
            return{
                File_Url: this.$api.FILE_URL,
                needId: '',
                userId: '',
                myId: uni.getStorageSync('UserId'),
                is_show_publisher: 0,
                dataList: {}
            }
        },
        onLoad(query){
            this.needId = query.needId;
            this.userId = query.userId;
            this.is_show_publisher = query.is_show_publisher;
            this.getDemandSenderInfo();
        },
        methods:{
            //获取需求发布者的信息
            async getDemandSenderInfo(){
                let params = {
                    demand_id: this.needId,
                    user_id: this.userId
                }
                const res = await this.$api.getDemandSenderInfo(params);
                if (res.data.level == 'success'){
                    this.dataList = res.data.data
                }
            },
            //拨打手机号
            callPhone(number){
                uni.showModal({
                    title: '提示',
                    content: '将转到拨号界面拨打'+number+'，是否进行？',
                    success: function (res) {
                        if (res.confirm) {
                            uni.makePhoneCall({
                                phoneNumber: number
                            });
                        } else if (res.cancel) {
                            uni.showToast({
                                icon:'none',
                                title: "取消成功！"
                            })
                        }
                    }
                })
            }
        }
    }
</script>

<style scoped lang="scss">
    @import '~@/static/scss/mixin.scss';
    .page{
        background: #F8F8F8;
        min-height: 100vh;
    }
    .person-title{
        padding: 20rpx 30rpx 6rpx 30rpx;
        @include flex(flex-start);
        flex-direction: row;
        .vertical{
            width: 8rpx;
            height: 40rpx;
            background: #3782FF;
            border-radius: 4rpx;
        }
        .title{
            height: 45rpx;
            line-height: 45rpx;
            font-weight: bold;
            font-size: 32rpx;
            padding: 0 10rpx;
        }
    }
    .person-content{
        background: #FFFFFF;
        view{
            border-bottom: 1rpx solid #E5E5E5;
        }
        view:last-child{
            border-bottom: none;
        }
        .person-head{
            padding: 30rpx 0;
            @include flex();
            flex-direction: column;
            .img{
                height: 164rpx;
                width: 164rpx;
                position: relative;
                img{
                    width: 100%;
                    height: 100%;
                    border-radius: 360rpx;
                }
                .icon{
                    position: absolute;
                    right: 0rpx;
                    width: 40rpx;
                    height: 40rpx;
                    bottom: 0;
                }
            }
        }
        .person-item{
            padding: 38rpx 30rpx;
            @include flex(flex-start);
            flex-direction: row;
            text{
                min-height: 45rpx;
                line-height: 45rpx;
                font-size: 32rpx;
            }
            text:last-child{
                margin-left: auto;
                max-width: 60%;
                @include ellipsis(2);
                text-align: right;
            }
            .grey{
                color: #999999;
            }
            .blue{
                color: #3782FF;
            }
        }
    }
    .company-title{
        padding: 40rpx 30rpx 6rpx 30rpx;
        @include flex(flex-start);
        flex-direction: row;
        .vertical{
            width: 8rpx;
            height: 40rpx;
            background: #3782FF;
            border-radius: 4rpx;
        }
        .title{
            height: 45rpx;
            line-height: 45rpx;
            font-weight: bold;
            font-size: 32rpx;
            padding: 0 10rpx;
        }
    }
    .company-content{
        background: #FFFFFF;
        view{
            border-bottom: 1rpx solid #E5E5E5;
        }
        view:last-child{
            border-bottom: none;
        }
        .company-head{
            padding: 30rpx 0;
            @include flex();
            flex-direction: column;
            .img{
                height: 164rpx;
                width: 164rpx;
                position: relative;
                img{
                    width: 100%;
                    height: 100%;
                    border-radius: 360rpx;
                }
                .icon{
                    position: absolute;
                    right: 0rpx;
                    width: 50rpx;
                    height: 50rpx;
                    bottom: 0;
                }
            }
        }
        .company-item{
            padding: 38rpx 30rpx;
            @include flex(flex-start);
            flex-direction: row;
            text{
                min-height: 45rpx;
                line-height: 45rpx;
                font-size: 32rpx;
            }
            .right{
                margin-left: auto;
                max-width: 60%;
                @include ellipsis(2);
                /*text-align: right;*/
            }
            .grey{
                color: #999999;
            }
            .blue{
                color: #3782FF;
            }
        }
        .company-range{
            padding: 38rpx 30rpx;
            @include flex(flex-start);
            flex-direction: row;
            .left{
                height: 45rpx;
                line-height: 45rpx;
                font-size: 32rpx;
            }
            .right{
                margin-left: auto;
                max-width: 60%;
                @include flexWrap(flex-start);
                flex-direction: row;
                text{
                    height: 45rpx;
                    padding: 0 16rpx;
                    background: #3782FF;
                    border-radius: 8rpx;
                    font-size: 32rpx;
                    line-height:45rpx;
                    margin-right: 10rpx;
                    color: #FFFFFF;
                }
            }
        }
    }
</style>